<html>
    
    <head>
        
        <title> <?php echo $title; ?></title>

        <!-- Chargement de JQuery -->
        <script type="text/javascript" src="<?php echo(js_url('jquery')); ?>"></script>
        <script type="text/javascript" src="<?php echo(js_url('jquery-ui')); ?>"></script>

        <!-- Chargement du script du jeu 1 -->
        <script type="text/javascript" src="<?php echo(js_url('album')); ?>"></script>

        <!-- Chargement de la feuille de style -->
        <link rel="stylesheet" type="text/css" href="<?php echo(css_url('album')); ?>">

    </head>

    <body>

        <div id="content">
            <div id="overlay_album"></div>
            <!-- Définition de la zone d'interaction : zone centrale + zone de liste d'items -->
            <div id="zone_interaction">

                <!-- Définition de la zone centrale -->
                <div id="zone_centrale">
                    <div id="zone_centrale">
                        <div id="cadre_zone_centrale"></div>
                        <div id="intro" class="zone_texte">
                            <p><?php echo $intro->chapters_description;?></p>
                        </div>
                    </div>

                </div>

                <!-- Définition de la zone de liste de cartes -->
                <div id="cadre_liste_cartes"></div>
                <div id="liste_cartes">
                    <?php for($i=0;$i<3;$i++){?>
                        <img id="carte_<?php echo($i+1);?>" class="carte" height="130" width="100" src="<?php echo(img_album_url('img_'.$cartes_id[$i].'.png'));?>">
                    <?php }?>

                </div>
            </div>

            <!-- Définition de la zone basse : zone de navigation + zone de chronométrage -->
            <div id="zone_basse">
                <!-- Définition de la zone de navigation -->
                <div id="zone_navigation">
                    <a id="btn_home" type="button" href="<?php echo site_url('home/index'); ?>">
                        <div class="btns_navigation">
                            <img id="img_btn_home" height="50" width="53" src="<?php echo(img_commun_url('commun_btn_home.png'));?>"> 
                        </div>
                    </a>
                    <a id="btn_next_intro" type="button" onclick="goToChapters('<?php echo $next_chapter;?>')">
                    <div class="btns_navigation">
                        <img id="img_btn_next" height="50" width="53" src="<?php echo(img_commun_url('commun_btn_next.png'));?>"> 
                    </div>
                    </a>
                </div>
            </div>

        </div>

    </body>

</html>
